<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
     <%@page import="java.io.*" %>
     <%@page import="mavenWebProject.userMapper" %>
     <%@page import="mavenWebProject.user" %>
     <%@page import="mavenWebProject.productsMapper" %>
     <%@page import="mavenWebProject.products" %>
     <%@page import="mavenWebProject.order" %>
     <%@page import="mavenWebProject.car" %>
     <%@page import="java.util.*" %>
     <%@page import="javax.servlet.*" %>
     <%@page import="org.apache.ibatis.io.Resources" %>
     <%@page import="org.apache.ibatis.session.SqlSession"%>
     <%@page import="org.apache.ibatis.session.SqlSessionFactory" %>
     <%@page import="org.apache.ibatis.session.SqlSessionFactoryBuilder" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>管理员</title>
</head>

<style>
    body{font-family: 楷体;font-size: 18px;}

    table[id="tableGuide"]{
        position: absolute;
        top:0%;
        left:0%;
        width:100%;
        height:200px;
        background-color: black;
        color:white;
    }

    table{position: absolute;top:60px;left:0px;background-color:rgb(241,245,251);width:100%;height:700px;border-top-left-radius: 10px;border-top-right-radius: 10px;}
    
    
    a:link{color:white;text-decoration:none;padding:10px;}
    a:hover{padding:8px;border-radius: 5px;background-color: aliceblue;color: black;}
    a:visited{color:white;}
    a[id="manageProducts"]{color:white;}
    a[id="manageProducts"]:hover{color:black;}
    a[id="tableProductsManageSearchButton"]{margin-left:20px;padding:8px;background-color:white;border-radius:8px;}
	
    p{margin:0px;}
    
   	label{margin-right:10px;}
   	input[type="text"]{border:1px solid black;background-color:rgb(0,0,0,0);height:25px;width:150px;border-radius:8px;}
</style>

<body>
    
    <%String username=String.valueOf(session.getAttribute("username")); %>
    <table id="tableGuide" border="0" cellspacing="10px">
        <tr></tr>
        <tr><td width="30px"></td><td width="200px"><p style="color:white;font-size:25px;">|商品信息编辑</p></td><td width="100px"></td><td width="100px"></td><td width="100px"></td><td width="100px"></td><td width="100px"></td><td align="right" width="800px">欢迎您：<font style="font-size:24px;margin:10px;color:cyan;"><%=username%></font>&nbsp;&nbsp;<a style="color:red" onClick="exit()">注销</a></td></tr>
        <tr><td colspan="8" height="150px"></tr>
    </table>
    <script>

        function exit(){document.location.href="loadIn.jsp";}

    </script>

	<%
	
	%>
   <table border="0" cellspacing="10px">
   <form id="editProductsForm">
   <%
	String resource = "mybatis-config.xml";
	InputStream inputStream = Resources.getResourceAsStream(resource);
	SqlSessionFactory sqlSessionFactory = new SqlSessionFactoryBuilder().build(inputStream);
	SqlSession sqlsession=sqlSessionFactory.openSession();
	userMapper userMapper=sqlsession.getMapper(userMapper.class);
	productsMapper productsMapper=sqlsession.getMapper(productsMapper.class);
	int id=Integer.valueOf(request.getParameter("id"));
	List<products> products=productsMapper.selectById(id);
	String name="";int price=0;int storage=0;int sold=0;int all_ordered=0;int status=0;String for_group="";String kind="";
	for(products s:products){
   		id=s.getId();name=s.getName().trim();price=s.getPrice();storage=s.getStorage();sold=s.getSold();status=s.getStatus();all_ordered=s.getAll_ordered();for_group=s.getFor_group().trim();kind=s.getKind().trim();
   }%>
   <tr><td colspan="4" height="80px" ></tr>
	<tr><td align="right" rowspan="7" width="500px"></td><td width="100px" align="right">商品名称：</td><td width="500px"><input id="name" name="name" type="text" value=<%=name%>><span id="wrongName" style="color:red;display:none;">商品名称长度必须为2-20位</span></td><td rowspan="7" width="300px"></td></tr>
	<tr><td align="right">价格：</td><td><input id="price" name="price" type="text" value=<%=price%>><span id="wrongPrice" style="color:red;display:none;">请输入一个大于等于0的数字</span></td></tr>
	<tr><td align="right">库存：</td><td><input id="storage" name="storage" type="text" value=<%=storage%>><span id="wrongStorage" style="color:red;display:none;">请输入一个大于等于0的数字</span></td></tr>
	<tr><td align="right">排序：</td><td><input id="all_ordered" name="all_ordered" type="text" value=<%=all_ordered%>><span id="wrongAllOrdered" style="color:red;display:none;">请输入一个大于等于0的数字</span></td></tr>
	<tr><td align="right">针对群体：</td><td><input type="radio" id="for1" name="for_group" value="a"><label for="for1">全部</label><input type="radio" id="for2" name="for_group" value="w"><label for="for2">女性</label>
	<input type="radio" id="for3" name="for_group" value="m"><label for="for3">男性</label></td></tr>
	<tr><td align="right">种类：</td><td><input type="radio" id="kind1" name="kind" value="clothing"><label for="kind1">服装</label><input type="radio" id="kind2" name="kind" value="bag"><label for="kind2">背包</label>
	<input type="radio" id="kind3" name="kind" value="jewelry"><label for="kind3">珠宝</label></td></tr>
	<tr><td></td><td><a onClick="submitEdition()" style="color:white;padding:8px;background-color:rgb(0,0,0,0.6);margin-right:20px;border-radius:8px;">修改</a><a style="color:white;padding:8px;background-color:rgb(0,0,0,0.6);border-radius:8px;" onClick="reset()">取消修改</a></td></tr>
	<tr><td colspan="4" height="100px" align="center"></td></tr>
   	</form>
   </table>
   
   <script>
   		const name=document.getElementById("name");
   		const price=document.getElementById("price");
   		const storage=document.getElementById("storage");
   		const all_ordered=document.getElementById("all_ordered");
   		const for1=document.getElementById("for1");
   		const for2=document.getElementById("for2");
   		const for3=document.getElementById("for3");
   		const kind1=document.getElementById("kind1");
   		const kind2=document.getElementById("kind2");
   		const kind3=document.getElementById("kind3");
   		name.onblur=checkName;price.onblur=checkPrice;storage.onblur=checkStorage;all_ordered.onblur=checkAll_ordered;
   		function checkName(){
   			if(!(name.value.length>=2 && name.value.length<=20)){
   				document.getElementById("wrongName").style.display="";return false;
   			}else{document.getElementById("wrongName").style.display="none";return true;}
   		}
   		function checkPrice(){
   			if(price.value>=0){
   				document.getElementById("wrongPrice").style.display="none";return true;
   			}else{document.getElementById("wrongPrice").style.display="";return false;}
   		}
   		function checkStorage(){
   			if(storage.value>=0){
   				document.getElementById("wrongStorage").style.display="none";return true;
   			}else{document.getElementById("wrongStorage").style.display="";return false;}
   		}
   		function checkAll_ordered(){
   			if(all_ordered.value>=0){
   				document.getElementById("wrongAllOrdered").style.display="none";return true;
   			}else{document.getElementById("wrongAllOrdered").style.display="";return false;}
   		}
   		const for_group="<%=for_group%>"
   		if(for_group=="a"){
   			for1.checked="true";
   		}else if(for_group=="w"){
   			for2.checked="true";
   		}else if(for_group=="m"){
   			for3.checked="true";
   		}
   		const kind="<%=kind%>"
   		if(kind=="clothing"){
   			kind1.checked="true";
   		}else if(kind=="bag"){
   			kind2.checked="true";
   		}else if(kind=="jewelry"){
   			kind3.checked="true";
   		}
   		
   		function submitEdition(){
   			if(checkName() && checkPrice() && checkStorage() && checkAll_ordered()){
   				document.getElementById("editProductsForm").method="post";document.getElementById("editProductsForm").action="ProductsManageServlet?do=editProducts&id="+"<%=id%>";
   				document.getElementById("editProductsForm").submit();
   			}else{alert("数据输入有误，请检查");return false;}
   		}
   			
   </script>

</body>
</html>